{{ define "navbar"}}
<style>
    .text-center{text-align: center;}
    .header li.nav-dir{position: relative;top:1px;}
    .header li.nav-dir a.nav-dir-name{display: inline-block;margin-left:17px;}
    .header li.nav-dir img.nav-dir-img{width: 18px;height: 18px;position: absolute;top:5px;left:5px;}
    .header li.nav-dir ul.sub-nav-ul{position:absolute;z-index:999;background-color:#EEEEEE;display: none}
    .header li.nav-dir ul.sub-nav-ul li{display: inline-block;width: 100%;text-align: left;min-width:0;}
    .header li.nav-dir ul.sub-nav-ul li.cur-nav{color:#009933;}
    .header li.nav-dir ul.sub-nav-ul li.cur-nav a{color: #009933;}
    .header li.nav-dir ul.sub-nav-ul li a{text-align: center;min-width:0;margin:0;display: inline-block;width:100%;padding: 0 0 0 2px;color:#333333;background-color:#EEEEEE;}
    .header li.nav-dir ul.sub-nav-ul li a:hover{color:#009933;}
</style>
<script type="application/javascript">
    function showSubNav(i){
        $(i).find('.sub-nav-ul').off("mouseover")
        $(i).find('.sub-nav-ul').off("mouseleave")
        $(i).find('.sub-nav-ul').slideDown("fast",function (){
            $(i).find('.sub-nav-ul').on("mouseleave",function (){
                $(i).find('.sub-nav-ul').slideUp();
            })
        });
    }
</script>
<div class="header">
    <nav class="navbar">
        <ul>{{$curId := .CurId}}{{$currentDir := .CurrentDir}}{{$itemClass := ""}}{{$subItemClass := ""}}
            {{range .FileList }}
                {{if eq .IsCategory 1 }}
                    {{if eq .Id $currentDir}}
                        {{$itemClass = "cur-nav"}}
                    {{else}}
                        {{$itemClass = ""}}
                {{end}}
                    <li class="nav-dir float-left {{$itemClass}}" onmouseover="showSubNav(this)">
                        <img class="nav-dir-img" src="/images/dir.png" alt=""> <a href="#" class="nav-dir-name">{{.CategoryName}}</a>
                        <ul class="sub-nav-ul">
                            {{range .ChildList}}
                            {{if eq .Id $curId}}{{$subItemClass = "cur-nav"}}{{else}}{{$subItemClass = ""}}{{end}}
                            <li class="nav-file {{$subItemClass}}"><a href="/read/{{.Id}}">{{.MdTitle}}</a></li>
                            {{end}}
                        </ul>
                    </li>
                {{else}}
                    {{if eq .Id $curId}}
                        <li class="nav-file float-left cur-nav"><a href="/read/{{.Id}}">{{.MdTitle}}</a></li>
                    {{else}}
                        <li class="nav-file float-left"><a href="/read/{{.Id}}">{{.MdTitle}}</a></li>
                    {{end}}
                {{end}}
            {{end}}

            {{if ne .User "" }}
                <li class="float-right"><a href="/admin/logout">退出</a></li>
                <li class="float-right"><a href="/admin">admin</a></li>
                <li class="float-right"><a href="/admin/edit/{{.CurId}}">编辑</a></li>
            {{else}}
                <li class="float-right"><a href="/login">Login</a></li>
            {{end}}
        </ul>
    </nav>
</div>
{{end}}